﻿<phone:PhoneApplicationPage
    x:Class="Enough.Lego.Mindstorms.WP.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:localcontrols="clr-namespace:Enough.Lego.Mindstorms.WP.Controls"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Landscape" Orientation="Landscape"
    shell:SystemTray.IsVisible="False"
    DataContext="{Binding Main, Source={StaticResource Locator}}"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
    xmlns:cmd="clr-namespace:GalaSoft.MvvmLight.Command;assembly=GalaSoft.MvvmLight.Extras.WP8"
    xmlns:xamlconverter="clr-namespace:Enough.Lego.Mindstorms.WP.Converter"
    >

    <phone:PhoneApplicationPage.Resources>
        <xamlconverter:BooleanToVisibilityConverter x:Name="VisibilityConverter" />
    </phone:PhoneApplicationPage.Resources>
         
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="BackKeyPress">
            <cmd:EventToCommand Command="{Binding BackKeyPressCommand}" PassEventArgsToCommand="True"/>
        </i:EventTrigger>
    </i:Interaction.Triggers>

    <!--LayoutRoot ist das Stammraster, in dem alle anderen Seiteninhalte platziert werden-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <Image Grid.Row="1" Source="Assets/background.png" Height="480" Width="800" />

        <localcontrols:Joystick x:Name="joystick" Grid.Row="1" HorizontalAlignment="Left" TimerMilliSeconds="{Binding TimerMilliseconds}" Width="275" Margin="37,58,0,146" >
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="NewCoordinates">
                    <cmd:EventToCommand PassEventArgsToCommand="True" Command="{Binding NewCoordinates}"/>
                </i:EventTrigger>
                <i:EventTrigger EventName="Stop">
                    <cmd:EventToCommand PassEventArgsToCommand="True" Command="{Binding StopMovement}"/>
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </localcontrols:Joystick>

        <Image Grid.Row="1" Source="{Binding LeftButtonSource}" Width="80" Margin="38,142,682,-142">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="ManipulationStarted">
                    <cmd:EventToCommand Command="{Binding TurnLeftCommand}"/>
                </i:EventTrigger>
                <i:EventTrigger EventName="ManipulationCompleted">
                    <cmd:EventToCommand Command="{Binding StopTurningLeftCommand}"/>
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Image>
        <Image Grid.Row="1" Source="{Binding RightButtonSource}" Width="80" Margin="233,142,487,-142">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="ManipulationStarted">
                    <cmd:EventToCommand Command="{Binding TurnRightCommand}"/>
                </i:EventTrigger>
                <i:EventTrigger EventName="ManipulationCompleted">
                    <cmd:EventToCommand Command="{Binding StopTurningRightCommand}"/>
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Image>

        <Image Grid.Row="1" Source="Assets/display.png" Margin="344,117,277,237" />
        <TextBlock x:Name="StatusOutput" Grid.Row="1" Text="{Binding StatusText, Mode=TwoWay}" TextAlignment="Center" Margin="356.333,184.327,291.667,250.673" FontFamily="Segoe WP Semibold" FontSize="35" RenderTransformOrigin="0.5,0.5" UseLayoutRounding="False" d:LayoutRounding="Auto"  >
            <TextBlock.RenderTransform>
                <CompositeTransform Rotation="-0.291"/>
            </TextBlock.RenderTransform>
        </TextBlock>

        <Image Grid.Row="1" Source="{Binding OpenButtonSource}" Margin="528,45,19,237">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="ManipulationStarted">
                    <cmd:EventToCommand Command="{Binding StartOpeningCommand}"/>
                </i:EventTrigger>
                <i:EventTrigger EventName="ManipulationCompleted">
                    <cmd:EventToCommand Command="{Binding StopOpeningCommand}"/>
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Image>
        <Image Grid.Row="1" Source="{Binding CloseButtonSource}" Margin="502,248,19,34">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="ManipulationStarted">
                    <cmd:EventToCommand Command="{Binding StartClosingCommand}"/>
                </i:EventTrigger>
                <i:EventTrigger EventName="ManipulationCompleted">
                    <cmd:EventToCommand Command="{Binding StopClosingCommand}"/>
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Image>
        
        <Grid Grid.Row="1" Visibility="{Binding ErrorMessage, Converter={StaticResource VisibilityConverter}}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Background="#E5000000">
            <StackPanel Orientation="Vertical" VerticalAlignment="Center">
                <TextBlock Text="Sorry there is an error! Please try again!" VerticalAlignment="Center" TextAlignment="Center" FontFamily="Segoe WP Semibold" FontSize="30" />
                <Button IsEnabled="{Binding IsEnabled}" Command="{Binding TryAgainCommand}" Width="150" Height="80" Content="Try again" />
                <ProgressBar IsIndeterminate="{Binding IsBusy}" Height="10" Foreground="#FFABD104" />
            </StackPanel>
        </Grid>
        
        <!--<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock x:Name="StatusOutput" Text="{Binding StatusText, Mode=TwoWay}" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
        </StackPanel>-->

        <!--ContentPanel - zusätzliche Inhalte hier platzieren-->
        <!--<StackPanel x:Name="ContentPanel" Orientation="Horizontal" Grid.Row="1" Margin="12,0,12,0">
            <localcontrols:Joystick x:Name="joystick" HorizontalAlignment="Left" TimerMilliSeconds="{Binding TimerMilliseconds}" Width="300" Height="300"  Margin="0,90"  >
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="NewCoordinates">
                        <cmd:EventToCommand PassEventArgsToCommand="True" Command="{Binding NewCoordinates}"/>
                    </i:EventTrigger>
                    <i:EventTrigger EventName="Stop">
                        <cmd:EventToCommand PassEventArgsToCommand="True" Command="{Binding StopMovement}"/>
                    </i:EventTrigger>
                </i:Interaction.Triggers>
            </localcontrols:Joystick>
            <StackPanel Orientation="Vertical" Margin="100,100,0,0">
                <StackPanel Orientation="Horizontal">
                    <Button Content="Open" Command="{Binding OpenGrabber}" Height="100" Width="160" />
                    <Button Content="Close" Command="{Binding CloseGrabber}" Height="100" Width="160" />
                </StackPanel>
                <StackPanel Orientation="Horizontal">
                    <Button Content="90° right" Height="100" Width="160" >
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="ManipulationStarted">
                                <cmd:EventToCommand Command="{Binding TurnRightCommand}"/>
                            </i:EventTrigger>
                            <i:EventTrigger EventName="ManipulationCompleted">
                                <cmd:EventToCommand Command="{Binding StopTurningRightCommand}"/>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Button>
                    <Button Content="90° left" Height="100" Width="160">
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="ManipulationStarted">
                                <cmd:EventToCommand Command="{Binding TurnLeftCommand}"/>
                            </i:EventTrigger>
                            <i:EventTrigger EventName="ManipulationCompleted">
                                <cmd:EventToCommand Command="{Binding StopTurningLeftCommand}"/>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Button>
                </StackPanel>
            </StackPanel>
        </StackPanel>-->

        <!--Auskommentieren, um ein Ausrichtungsraster anzuzeigen und sicherzustellen, dass Ihre Steuerelemente
            an den allgemeinen Grenzen ausgerichtet sind.  Das Bild hat oben einen Rand von -32 px wegen
            der Taskleiste. Legen Sie dies auf 0 fest (oder entfernen Sie den Rand komplett),
            wenn die Taskleiste ausgeblendet wird.

            Entfernen Sie vor dem Versand dieses XAML und das Bild selbst.-->
        <!--<Image Source="/Assets/AlignmentGrid.png" VerticalAlignment="Top" Height="800" Width="480" Margin="0,-32,0,0" Grid.Row="0" Grid.RowSpan="2" IsHitTestVisible="False" />-->
    </Grid>

</phone:PhoneApplicationPage>